<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>服务详情</title>
    <meta name="viewport" content=" initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <link href="{$Think.config.RESOURCEURL}wx_assets/css/common.css{$Think.config.RESOURCE_VER}" rel="stylesheet">
    <script src="{$Think.config.RESOURCEURL}wx_assets/personCenter/js/mediaQuery.min.js{$Think.config.RESOURCE_VER}"></script>
    <script type='text/javascript' src='{$Think.config.RESOURCEURL}wx_assets/js/zepto.1.1.3.min.js{$Think.config.RESOURCE_VER}'></script>
    <script src="{$Think.config.RESOURCEURL}wx_assets/js/zepto.alert.js{$Think.config.RESOURCE_VER}" type="text/javascript"></script>
    <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
    <script src="{$Think.config.RESOURCEURL}wx_assets/js/util.js{$Think.config.RESOURCE_VER}" type="text/javascript"></script>
    <script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/wx_share.js{$Think.config.RESOURCE_VER}"></script>
    <style>
        ul.list {
            background-color: #fff;
        }
        ul.list > li {
            padding: .2rem;
            font-size: 0;
        }
        ul.list li .head {
            width: 1rem;
            overflow: hidden;
            display: inline-block;
            float: left;
        }
        ul.list li .head img {
            margin-top: .05rem;
            width: 100%;
        }
        ul.list li .con {
            margin-left: .2rem;
            width: 4.6rem;
            overflow: hidden;
            display: inline-block;
            float: left;
        }
        ul.list li .con span {
            display: block;
            font-size: .28rem;
            color: #586474;
        }
        ul.list li .con p {
            font-size: .28rem;
            color: #040404;
        }
        ul.list li .con .imgs {
            width: 100%;
        }
        ul.list li .con .imgs li {
            width: 30%;
            overflow: hidden;
            display: inline-block;
            position: relative;
            height: 1.5rem;
            margin-top: .15rem;
            float: left;
            margin-right: .1rem;
        }
        ul.list li .con .imgs li img {
            width: 100%;
        }
        ul.list li .con em {
            font-size: .24rem;
            color: #646a84;
            margin-right: .1rem;
            display: inline-block;
            margin-top: .1rem;
        }
        ul.list li .con p.time {
            font-size: .24rem;
            color: #909090;
            margin-top: .1rem;
        }
        ul.list li .con p.time a {
            display: inline-block;
            margin-left: .1rem;
        }
    </style>
</head>
<body>
<ul class="list">
    <li class="clearfix">
        <div class="head">
            <img src="{$headimgurl}" alt="">
        </div>
        <div class="con">
            <span>{$nickname}</span>
            <p>{$content}</p>
            <ul class="imgs clearfix">
                <volist name="image" id="img">
                    <li>
                        <img onclick="showImgs(this)" data-url="{$img}" src="{$img}@100w_100h_1e_1c_100sh" alt="">
                    </li>
                </volist>
            </ul>
            <em>{$divisionName}</em>
            <em>{$name}</em>
            <p class="time">
                {$createTime}
            </p>
        </div>
    </li>
</ul>
</body>
<script>
    function showImgs(ctl){
        var imgs = new Array(0);
        $(ctl).parents("ul.imgs").find("li").each(function(){
            imgs.push($(this).find("img").data("url"));
        });
        var thisImg = $(ctl).data("url");
        wx_share.showImg(imgs,thisImg);
    }
    wx_share.init({
        "pkg":{
            "appId": '{$pkg.appId}',
            "timestamp": '{$pkg.timestamp}',
            "nonceStr": '{$pkg.nonceStr}',
            "signature": '{$pkg.signature}'
        },
        hide:1
    });
</script>
</html>